<template>
    <div class="avatarBox">
        <el-image style="width: 100%;
            height: 100%;" :src="avatar" :preview-src-list="[avatar]" :initial-index="1" />
    </div>
</template>
<script setup>
import { defineProps, ref, getCurrentInstance } from 'vue'

const http = getCurrentInstance()?.appContext.config.globalProperties.$http

const props = defineProps({
    avatarUrl: String
})
let avatarUrl = props.avatarUrl

let avatar = ref()
// 得到头像
fetch(http + '/static/avatar/' + avatarUrl, {
    method: 'get',
    responseType: "blob",
}).then((response) => {
    return response.blob()
})
    .then((data) => {
        //将文件流转为64base
        avatar.value = window.URL.createObjectURL(data)
    }, () => {
        console.log('error');
    })


// 系主任得到用户头像
const getInfoAvatar = function (url) {
    fetch(http + '/static/avatar/' + url, {
        method: 'get',
        responseType: "blob",
    }).then((response) => {
        return response.blob()
    })
        .then((data) => {
            //将文件流转为64base
            avatar.value = window.URL.createObjectURL(data)
        }, () => {
            console.log('error');
        })
}

defineExpose({
    getInfoAvatar
})

</script>
<style scoped>
.avatarBox {
    width: 100%;
    height: 100%;
}
</style>
